.comments{ background-color: #ffffff; width: 100%; }
.comments>.head-contain{ height: 200px;   background-image: url("../../images/comments_bg.jpg");  background-size: cover; background-repeat: no-repeat; }
.comments>.input-wrap{ width: 600px; margin: 0 auto; margin-top: 30px; margin-bottom: 70px; text-align: right; }
.comments>.input-wrap>p{ margin-bottom: 10px; font-weight: bold; text-align: left; }

.comments>.sort-pagination{ width: 800px; margin: 0 auto; text-align: right; border-bottom: solid #339a99 1px; padding-bottom: 10px; }
.comments>.sort-pagination>.sort{ float: left; margin-top: 10px; }
.comments>.sort-pagination>.sort>li{ display: inline-block; width: 100px; text-align: center; cursor: pointer; }
.comments>.sort-pagination>.sort>li:hover{ color:#00a1d6; }
.comments>.sort-pagination>.sort>li[data-selected='true']{ color:#00a1d6; }
.comments>.sort-pagination>.page{  float: right; margin-right: 20px; }

.comments>.content-box{ width: 800px; margin: 0 auto; margin-bottom: 30px; }
.comment-item { border-bottom: 1px solid #e5e9ef; padding-top: 15px; }
.comment-item p.user{ height: 30px; line-height: 30px; font-weight: bold; }
.comment-item  .info{ height: 30px; line-height: 30px; font-size: 12px; color: #99a2aa; }
.comment-item  .time{ margin-right: 20px; }
.comment-item i.like{ display: inline-block; width: 14px; height: 14px; vertical-align: text-top; margin-right: 5px; background: url("../../images/icons-comment.png") no-repeat; background-position: -153px -25px; cursor: pointer; }
.comment-item i.liked{ background-position: -154px -89px; }
.comments>.pagination { display: block; margin: 0 auto; width: 800px; text-align: center; }
.comments>.sort-pagination::after{ display: block; width: 0; height: 0; content: ""; overflow: hidden; clear: both; }